<template>
	<div>
		<ul class="mui-table-view">
			<li class="mui-table-view-cell mui-media" v-for="(news, index) in info" :key="news.id" @click="dianji(index)">
				<router-link :to="'/home/news/newsdetail/' + news.id">

					<img class="mui-media-object mui-pull-left" :src="news.img">
					<div class="mui-media-body">
						{{ news.title }}
						<p class='mui-ellipsis'>{{ news.time }} 点击{{ news.click }}次</p>
					</div>
					
				</router-link >
			</li>
		</ul>
	</div>
</template>

<script>
	export default {
		data () {
			return {
				info: null
			}
		},
		methods: {
			getInfo () {
				this.$http.get('data.json').then(response => {
					this.info = response.body.news;
				})
			},
			dianji (ind) {
				this.info[ind].click += 1;
			}
		},
		created () {
			this.getInfo();
		}
	}
</script>
